<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <title>任务列表</title>
    <link rel="stylesheet" type="text/css" href="./static/css/app.css">
</head>
<body class="F5">
<div id="app" class="tasklist-page">
    <!-- header -->
    <div class="header">
        <div class="header-height"></div>
        <div class="header-wrap">
            <div class="header-content">
                <div class="left">
                    <div class="go-back"><img src="./static/images/go-back.png" alt=""></div>
                    <div class="text">任务列表</div>
                </div>
                <div class="title"></div>
            </div>
        </div>
    </div>
    <div class="top-wrap">
        <div class="title">达人升级任务</div>
        <div class="progress-bar">
            <div class="progress" style="width: 30%;"></div>
        </div>
        <div class="desc">当前完成进度3/10</div>
    </div>
    <div class="list-wrap">
        <div class="item">
            <div class="tag">推荐人</div>
            <div class="row">
                <div class="rank">01</div>
                <div class="avatar">
                    <img src="./static/images/avatar.png" alt="">
                </div>
                <div class="name-box">
                    <div class="nickname">李希晨</div>
                    <div class="phone">185****6898</div>
                </div>
            </div>
            <div class="right-wrap">
                <div class="right-box">
                    <div class="btn">已完成</div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="tag blue">平台</div>
            <div class="row">
                <div class="rank">02</div>
                <div class="avatar">
                    <img src="./static/images/avatar.png" alt="">
                </div>
                <div class="name-box">
                    <div class="nickname">李希晨</div>
                    <div class="phone">185****6898</div>
                </div>
            </div>
            <div class="right-wrap">
                <div class="right-box">
                    <div class="btn">已完成</div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="tag orange">级别</div>
            <div class="row">
                <div class="rank">03</div>
                <div class="avatar">
                    <img src="./static/images/avatar.png" alt="">
                </div>
                <div class="name-box">
                    <div class="nickname">李希晨</div>
                    <div class="phone">185****6898</div>
                </div>
            </div>
            <div class="right-wrap">
                <div class="right-box">
                    <div class="btn green">未确认</div>
                    <div class="time">倒计时：00:00:52</div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="tag orange">级别</div>
            <div class="row">
                <div class="rank">04</div>
                <div class="avatar">
                    <img src="./static/images/avatar.png" alt="">
                </div>
                <div class="name-box">
                    <div class="nickname">李希晨</div>
                    <div class="phone">185****6898</div>
                </div>
            </div>
            <div class="right-wrap">
                <div class="right-box">
                    <div class="btn blue">去补单</div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="tag orange">级别</div>
            <div class="row">
                <div class="rank">05</div>
                <div class="avatar">
                    <img src="./static/images/avatar.png" alt="">
                </div>
                <div class="name-box">
                    <div class="nickname">李希晨</div>
                    <div class="phone">185****6898</div>
                </div>
            </div>
            <div class="right-wrap">
                <div class="right-box">
                    <div class="btn blue">去补单</div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="tag orange">级别</div>
            <div class="row">
                <div class="rank">06</div>
                <div class="avatar">
                    <img src="./static/images/avatar.png" alt="">
                </div>
                <div class="name-box">
                    <div class="nickname">李希晨</div>
                    <div class="phone">185****6898</div>
                </div>
            </div>
            <div class="right-wrap">
                <div class="right-box">
                    <div class="btn blue">去补单</div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="./static/js/common.js"></script>
</body>
</html>